<template>
	<ul class="icon-demo0">
		<li v-for="(v,k) in iconList" :key="k">
			<ynet-icon :name="v.split('/')[0]" size="lg"></ynet-icon>
			<p>{{v}}</p>
		</li>
	</ul>
</template>
<script>
	import { Icon } from 'ynet-mobile'
	export default {
		title: '字体图标',
		name: 'icon-demo',
		components: {
			[Icon.name]: Icon
		},
		data(){
			return {
				iconList: [
					'rectangle',
					'right',
					'wrong',
					'arrow-left',
					'arrow-right',
					'arrow-up',
					'arrow-down',
					'invisible',
					'visible',
					'service',
					'setting',
					'close',
					'refresh',
					'edit',
					'sort',
					'info',
					'question',
					'security',
					'rmb',
					'wait',
					'check',
					'checked/success',
					'check-disabled',
					'clear/fail',
					'warn',
					'info-solid',
					'scan',
					'share',
					'back',
					'card-bag',
					'message',
					'order',
					'balance',
					'coupon',
					'address-book',
					'mobile-phone',
					'calendar',
					'home',
					'discovery',
					'switch',
					'time',
					'search',
					'user',
					'camera',
					'clock',
					'delete',
					'profession',
					'id-card',
					'authentication',
					'location',
					'filter',
					'motor-vehicle',
					'phone',
					'volumn',
				]
			}
		}
	}
</script>
<style lang="scss">
	.icon-demo0{
		display: flex;
		flex-wrap: wrap;
		text-align: center;
		padding-bottom: .8rem;
		li{
			width: 33.33%;
			padding-top: .8rem;
			& > p {
				padding: .2rem 0;
				font-size: .3rem;
				color: #666
			}
		}
	}
</style>